import React, { useState,useRef } from 'react'
import { Button, Checkbox, Form, Input } from 'antd';
import auth from '../../../../apis/modules/auth'
import '../../../../assets/styles/mineUpdata.less'

export default function MineUpdata() {
  const formInfo=useRef()
  const onFinish = (values) => {
    // console.log('Success:', values);
    auth.updatePwd(values)
    .then(res=>{
      console.log(res);
    })
    formInfo.current.resetFields()
  };
  const onFinishFailed = (errorInfo) => {
    console.log('Failed:', errorInfo);
  };
  return (
    <div className='main_box'>
      <div className='upTitle' >
        修改密码
      </div>
      <div className='up_form'>
        <Form
          name="basic"
          ref={formInfo}
          labelCol={{
            span: 8,
          }}
          wrapperCol={{
            span: 16,
          }}
          style={{
            maxWidth: 600,
          }}
          initialValues={{
            remember: true,
          }}
          onFinish={onFinish}
          onFinishFailed={onFinishFailed}
          autoComplete="off"
        >
          <Form.Item
            name="old"
            className='form_item'
            rules={[
              {
                required: true,
                message: '原有密码不能为空!',
              },
            ]}
          >
            <Input  className='form_inp' placeholder='请输入原账号密码' />
          </Form.Item>

          <Form.Item
            name="newpwd"
            className='form_item'
            rules={[
              {
                required: true,
                message: '新密码不能为空!',
              },
            ]}
          >
            <Input className='form_inp' placeholder='请输入新密码' />
          </Form.Item>

          <Form.Item
            name="newpwdtwo"
            className='form_item'
            rules={[
              {
                required: true,
                message: '确认密码不能为空!',
              },
            ]}
          >
            <Input className='form_inp' placeholder='请再次输入新密码' />
          </Form.Item>
          <div className="text-wrapper_10 ">
            密码长度8-20位且大写字母、小写字母、数字和标点符号至少包含2种
          </div>
          <Form.Item 
          >
            <Button className='form_btn' type="primary" htmlType="submit">
              确定
            </Button>
          </Form.Item>
        </Form>
      </div>
    </div>
  )
}
